import React, {Component} from 'react';
import './index.css'

type IProps = {
    currentState: any
}

class List extends Component<IProps> {

    render() {
        let {userList, isFirst, isLoading, err} = this.props.currentState;
        return (
            <div className="row">
                {
                    isFirst ? <h2>欢迎使用本系统</h2> :
                        isLoading ? <h2>加载中。。。</h2> :
                            err ? <h2 style={{color:'red'}}>发生了错误</h2> :

                                userList.map((value: any) => {
                                    return (
                                        <div key={value.id} className="card">
                                            <a  rel="noreferrer" href={value.html_url} target="_blank">
                                                <img alt="avatar_picture" src={value.avatar_url}
                                                     style={{width: '100px'}}/>
                                            </a>
                                            <p className="card-text">{value.login}</p>
                                        </div>
                                    )

                                })
                }


            </div>
        );
    }
}

export default List;